<template>
  <u-popup
    :show="visible"
    mode="bottom"
    :close-on-click-overlay="false"
    :closeable="true"
    :round="20"
    @close="visible = false">
    <view
      v-if="!!title"
      class="title fz-16">{{ title }}</view>
    <slot></slot>
  </u-popup>
</template>

<script>
export default {
  props: {
    show: {
      type: Boolean,
      require: true,
    },
    title: {
      type: String,
    },
  },
  computed: {
    visible: {
      get() {
        return this.show;
      },
      set(val) {
        this.$emit('update:show', val);
      },
    },
  },
};
</script>

<style lang="scss">
	.title{
		text-align: center;
		padding: 22rpx 0;
	}
</style>